<template>
    <table>
        <tr>
            <td>券类型</td>
            <td>
                <select v-model="info.type">
                    <option value="">请选择</option>
                    <option value="代金券">代金券</option>
                    <option value="折扣券">折扣券</option>
                    <option value="优惠券">优惠券</option>
                </select>
            </td>
        </tr>
        <tr>
            <td><span style="color: red;">*</span>代金券标题</td>
            <td>
                <input type="text" v-model="info.name"/>
            </td>
        </tr>
        <tr>
            <td>代金券副标题</td>
            <td>
                <input type="text" v-model="info.descrName"/>
            </td>
        </tr>
        <tr>
            <td>代金券图片</td>
            <td>
                <img :src="info.img" style="width: 80px;height: 80px;"/>
                <input type="file" @change="upt"/>
            </td>
        </tr>
        <tr>
            <td><span style="color: red;">*</span>剩余库存</td>
            <td>
                <input type="text" v-model="info.num"/>
            </td>
        </tr>
        <tr>
            <td>每人限领</td>
            <td>
                <input type="text" v-model="info.xian"/>
            </td>
        </tr>
        <tr>
            <td>使用条件</td>
            <td>
                <input type="text" v-model="info.tiao"/>
            </td>
        </tr>
        <tr>
            <td><span style="color: red;">*</span>减免金额</td>
            <td>
                <input type="text" v-model="info.money"/>
            </td>
        </tr>
        <tr>
            <td><span style="color: red;">*</span>有效期</td>
            <td>
                <input type="date" v-model="info.staTime"/>-
                <input type="date" v-model="info.endTime"/>
            </td>
        </tr>
        <tr>
            <td><span style="color: red;">*</span>适用业务</td>
            <td>
                <select v-model="info.yewu">
                    <option value="">请选择</option>
                    <option value="订房">订房</option>
                    <option value="商城">商城</option>
                    <option value="堂食">堂食</option>
                    <option value="收款码">收款码</option>
                </select>
                <!-- <input type="checkbox" v-model="info.yewu" name="1"/>订房
                <input type="checkbox" v-model="info.yewu" name="2"/>商城
                <input type="checkbox" v-model="info.yewu" name="3"/>堂食
                <input type="checkbox" v-model="info.yewu" name="4"/>收款码 -->
            </td>
        </tr>
        <tr>
            <td>使用须知</td>
            <td>
                <textarea v-model="info.info"></textarea>
            </td>
        </tr>
        <tr>
            <td><span style="color: red;">*</span>适用门店</td>
            <td>
                <select v-model="info.memName">
                    <option value="">请选择</option>
                    <option value="河北保定">河北保定</option>
                    <option value="北京昌平">北京昌平</option>
                    <option value="河北石家庄">河北石家庄</option>
                    <option value="广州白云山">广州白云山</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>服务电话</td>
            <td>
                <input type="text" v-model="info.phone"/>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <input type="button" value="保存" @click="add"/>
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
import { ref,onMounted } from 'vue';
import axios from 'axios';
import router from '@/router';
import { useRoute } from 'vue-router';
const route=useRoute();
const info=ref({
    "id": route.query.id,
  "name": "",
  "type": "",
  "descrName": "",
  "img": "",
  "num": 0,
  "xian": 0,
  "tiao": "",
  "money": "",
  "staTime": "",
  "endTime": "",
  "yewu": "",
  "info": "",
  "memName": "",
  "phone": "",
})
onMounted(()=>[
    fantian()
])
//反填
const fantian=()=>{
axios.get("https://localhost:7191/api/Members/fantian?id="+info.value.id).then(res=>{
    info.value=res.data;
})
}
//图片上传
const upt=(e:any)=>{
    var formdate=new FormData();
    var file=e.target.files[0];
    formdate.append("file",file)
    axios.post("https://localhost:7191/api/File/Upt",formdate).then(res=>{
        info.value.img=res.data;
    })
}
const add=()=>{
    if(info.value.name==""){
        alert('标题不能为空');
        return;
    }
    if(info.value.num==0){
        alert('库存不能小于0');
        return;
    }
    if(info.value.money==""){
        alert('减免金额不能为空');
        return;
    }
    if(info.value.staTime==""){
        alert('有效期不能为空');
        return;
    }
    if(info.value.endTime==""){
        alert('有效期不能为空');
        return;
    }
    if(info.value.yewu==""){
        alert('适用业务不能为空');
        return;
    }
    if(info.value.memName==""){
        alert('适用门店不能为空');
        return;
    }
    axios.put("https://localhost:7191/api/Members/userupd",info.value).then(res=>{
        if(res.data>0){
            alert('成功');
            router.push("/usershow");
        }
        else{
            alert('失败');
        }
    })
}
</script>

<style scoped>

</style>